
<div class="col-lg-12" id="container-button-save">
    <div id="main_button" class="btn btn-danger">Lưu Dữ Liệu</div>
    <h1 class="page-header">Thuộc tính sản phẩm</h1>
</div>
<div class="col-lg-12">
    <?php
    $form = $this->beginWidget(
                    'booster.widgets.TbActiveForm', array(
                    'htmlOptions' => array('class' => 'well', 'enctype' => 'multipart/form-data','id' => 'h_main_form'),
                    )
    );
    ?>
    <ul id="myTab" class="nav nav-tabs" role="tablist">
        <li class="active"><a href="#home" role="tab" data-toggle="tab">Thuộc tính</a></li>
        <li class=""><a href="#profile" role="tab" data-toggle="tab">Giá trị</a></li>

    </ul>
    <div id="myTabContent" class="tab-content">
        <div class="tab-pane fade active in" id="home">
            <p>
                <?php
                echo $form->textFieldGroup($model, 'name');
                echo $form->textFieldGroup($model, 'order');
                ?>
            </p>
        </div>
        <div class="tab-pane fade" id="profile">
            <p>
                <div id="container_values">
                <?php
                    $key = -1;
                    foreach($values as $key => $item){
                        echo '<div class="container_relative old_record">';
                        echo $form->hiddenField($item,'['.$key.']property_value_id',array('type'=>"hidden",'size'=>2,'maxlength'=>2,'class' => 'property_value_id'));
                        echo $form->textFieldGroup($item, '['.$key.']name');
                        echo '<span class="glyphicon glyphicon-remove"></span></div>';
                    }
                ?>
                </div>
                <div id="add_value" class="btn btn-warning">Thêm Giá trị</div>
            </p>
        </div>

    </div>
    <?php
    $this->endWidget();
    unset($form);
    ?>
</div>

<script>
    var key = <?php echo $key?>;
    var html = '<div class="container_relative"><div class="form-group"><input class="form-control" placeholder="Giá trị" name="PropertyValue[key_value][name]"  type="text" maxlength="255"></div><span class="glyphicon glyphicon-remove"></span></div>';
    $(document).ready(function(){
        //add value
        $('#add_value').on('click',function(){
            key++;
            newHtml = html.replace(/key_value/g, key);
            $('#container_values').append(newHtml);
        });
        //delete
        $(document).on('click','.container_relative .glyphicon-remove',function(){
            var parent = $(this).parent('.container_relative');
            if(parent.find('.property_value_id').size() > 0 && parent.find('.property_value_id').val() > 0){
                $.ajax({
                    url: '<?php echo Yii::app()->createUrl("property/removevalue")?>&id='+parent.find('.property_value_id').val(),
                    success: function(data){
                        if(data.id_deleted){
                            parent.remove();
                        }else{
                            alert('loi he thong');
                        }
                    }
                });
            }else{
                parent.remove();
            }
        });
    });
</script>
